<template>
    <div class="card">
        <!-- 搜索 -->
        <MyReportSearch
            :key="levelType"
            @search="search"
            @getParam="getParam"
            @addAssert="addAssert"
            :reportList="reportList"
        >
            <template slot="handle">
                <el-button type="primary" plain @click="createReport"
                    >生成报告</el-button
                >
            </template>
        </MyReportSearch>

        <!-- 卡片 -->
        <reportCard
            :card-data="cardData"
            @addAssert="addAssert"
            @getParam="getParam"
            @changePage="changePage"
            @jumpList="jumpList"
            @getList="getList"
        ></reportCard>
        <create-report-dialog
            ref="createDialogRef"
            plain
            :reportDialogParams="reportDialogParams"
            @getList="getList"
        ></create-report-dialog>
        <!-- 上传文件 -->
        <uploadFile
            ref="uploadRef"
            :targetStandardId="targetStandardId"
            :uploadVisible="uploadVisible"
            @addReport="addReport"
            @refreshReport="getList"
        ></uploadFile>
        <el-dialog
            title="新增诊改报告"
            :close-on-click-modal="false"
            :visible.sync="zykcDialog"
            width="30%"
            @close="close('formData')"
        >
            <el-form
                ref="formData"
                :model="formData"
                label-width="120px"
                label-position="left"
            >
                <el-form-item label="所属诊改阶段" prop="year">
                    <el-select
                        v-model="formData.year"
                        placeholder="请选择所属诊改阶段"
                        @change="changeYear"
                    >
                        <el-option
                            v-for="year in yearArr"
                            :key="year"
                            :label="`${year}年`"
                            :value="year"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="报告名称" prop="reportName">
                    <el-select
                        v-model="formData.reportName"
                        placeholder="请选择"
                        @change="changeReportName"
                    >
                        <el-option
                            v-for="(item, i) in reportNameOptions"
                            :key="i"
                            :label="item.reportName"
                            :value="item.id"
                        >
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item
                    prop="deptCode"
                    :label="zykcReprot ? '诊改专业' : '诊改课程'"
                >
                    <el-select
                        v-model="formData.deptCode"
                        filterable
                        :placeholder="
                            `请选择` + zykcReprot ? '诊改专业' : '诊改课程'
                        "
                    >
                        <el-option
                            :label="item.splicing"
                            :value="item.id"
                            v-for="(item, i) in departList"
                            :key="i"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="填写人员" prop="editPersons">
                    <el-select
                        filterable
                        v-model="formData.editPersons"
                        multiple
                        placeholder="请选择填写人员"
                    >
                        <el-option
                            :label="item.realName"
                            :value="item.userName"
                            v-for="(item, i) in editPersonList"
                            :key="i"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="关联目标标准" prop="chain">
                    <el-select
                        v-model="formData.chain"
                        multiple
                        @change="changeObj"
                        placeholder="请选择目标标准"
                    >
                        <el-option
                            v-for="(item, i) in targetStandardList"
                            :key="i"
                            :label="item.name"
                            :value="item.id"
                        >
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="close('formData')">关 闭</el-button>
                <el-button type="primary" @click="save">保 存</el-button>
            </span>
        </el-dialog>
        <el-dialog
            title="新增诊改报告"
            :close-on-click-modal="false"
            :visible.sync="jsxsDialog"
            width="30%"
            label-position="left"
            @close="close('ruleForm')"
        >
            <el-form ref="ruleForm" :model="ruleForm" label-width="120px">
                <el-form-item label="所属诊改阶段" prop="year">
                    <el-select
                        v-model="ruleForm.year"
                        placeholder="请选择所属诊改阶段"
                        @change="changeTeachYear"
                    >
                        <el-option
                            v-for="year in yearArr"
                            :key="year"
                            :label="`${year}年`"
                            :value="year"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="报告名称" prop="reportName">
                    <el-input
                        v-model="ruleForm.reportName"
                        placeholder="请输入报告名称"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="所属学院" prop="belongSchool">
                    <el-input
                        v-model="ruleForm.belongSchool"
                        placeholder="请输入所属学院"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="所属专业" prop="deptCode">
                    <el-input
                        v-model="ruleForm.deptCode"
                        placeholder="请输入所属专业"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="填写人员">
                    <el-input
                        v-model="ruleForm.editPersons"
                        placeholder="请输入填写人员"
                    >
                    </el-input>
                </el-form-item>
                <el-form-item label="关联目标标准" prop="chain">
                    <el-input
                        v-model="ruleForm.chain"
                        placeholder="请输入目标标准"
                    >
                    </el-input>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="close('ruleForm')">关 闭</el-button>
                <el-button type="primary" @click="saveRule">保 存</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import MyReportSearch from './module/reportSearch.vue';
import reportCard from '@/components/cardToList/reportCard';
import {
    getMyReport,
    getOfflineReport,
    getProfessionalByIds,
    getDiagnosiaReform,
    createReport as createReportApi,
    getReportNameById,
    getProfessionalById,
    getChecker
} from '@/api/report';
import { getQueryTarget } from '@/api/target';

import createReportDialog from '@/views/report/myReport/module/createReportDialog';
import uploadFile from './module/uploadFile.vue';
import { getStorage } from '../../../config/utils';

export default {
    name: 'card',
    components: {
        MyReportSearch,
        reportCard,
        createReportDialog,
        uploadFile
    },
    data () {
        return {
            searchFrom: {
                name: '',
                reportIndexs: '',
                rectificationObjectName: '',
                year: '',
                pageIndex: 1,
                pageSize: 10,
                examineState: ''
            },
            // 层级：学校层，专业层，课程层，教师层，学生层
            levelType: '',
            cardData: {},
            reportDialogParams: {
                visible: false
            },
            // 上传文件
            uploadVisible: {
                visible: false
            },
            // 查询器所需菜单
            reportList: [],
            targetStandardId: '',
            // 当前层级页面
            currentPageName: '',
            zykcDialog: false,
            zykcReprot: '',
            yearArr: this.$config.yearArr(),
            formData: {
                year: '',
                reportName: '',
                deptCode: '',
                editPersons: [],
                chain: ''
            },
            reportNameOptions: [],
            departList: [],
            editPersonList: [],
            targetStandardList: [],
            jsxsDialog: false,
            jssxReprot: '',
            ruleForm: {
                year: '',
                reportName: '',
                deptCode: '',
                editPersons: getStorage('userInfo').realName,
                chain: '',
                belongSchool: ''
            },
            reportNameObj: {},
            deptCodeObj: {},
            editPersonsObj: getStorage('userInfo'),
            chainObj: {},
            belongSchool: {}
        };
    },
    created () {
        this.levelType = this.$route.params.type;
        // console.log(this.levelType, 'this.levelType');
        // this.currentPageName = this.$route.query.name
        // console.log(this.currentPageName, 'currentPageName');
        this.searchFrom.reportIndexs = this.levelType;
        this.getList();
        this.getReport();
    },
    mounted () {},
    methods: {
        changeObj (val) {
            console.log(val);
        },
        // 搜索
        search (searchFrom) {
            this.searchFrom.pageIndex = 1;
            this.searchFrom.name = searchFrom.name;
            this.searchFrom.year = searchFrom.year;
            this.searchFrom.examineState = searchFrom.examineState;
            this.getList();
        },
        // 获取card数据
        getList () {
            getMyReport(this.searchFrom)
                .then(res => {
                    // console.log(res, '-=-=');
                    this.reportList = res.dataList;
                    this.cardData = res || {};
                })
                .catch(() => {});
        },
        // 跳转至详情
        jumpList (card) {
            const name = card.reportName;
            // const level = this.$route.meta.title;
            // const range = card.rangeName;

            this.$router.push({
                path: `/report/myReport/cardDetail/${this.levelType}`,
                query: {
                    id: card.id,
                    standardId: card.targetStandardId,
                    title: `${name}`,
                    examineUser: card.examineUser,
                    examineState: card.examineState
                }
            });
        },
        // 切换分页
        changePage (searchForm) {
            this.searchFrom.pageIndex = searchForm.pageIndex;
            this.searchFrom.pageSize = searchForm.pageSize;
            this.getList();
        },
        async createReport () {
            // console.log(this.$route.query.name, '[=[=]]');

            const currentPageName = this.$route.query.name;
            const type = this.$route.params.type
            // console.log(currentPageName, 'currentPageName');
            if (
                ['BG_ZT', 'BG_LEVEL_XX', 'BG_JXDW'].includes(type)
            ) {
                this.reportDialogParams = {
                    visible: true
                };
                this.$refs.createDialogRef.changeDept(
                    getStorage('userInfo').orgCode
                );
            }
            if (
                [
                    'BG_LEVEL_ZY',
                    'BG_LEVEL_KC',
                    'BG_LEVEL_JS',
                    'BG_LEVEL_XS'
                ].includes(type)
            ) {
                getChecker({
                    reportIndex: type
                }).then(res => {
                    if (!res) {
                        return false;
                    }
                    if (
                        ['BG_LEVEL_ZY', 'BG_LEVEL_KC'].includes(type)
                    ) {
                        this.zykcDialog = true;
                        if (['BG_LEVEL_ZY'].includes(type)) {
                            this.zykcReprot = true;
                        } else {
                            this.zykcReprot = false;
                        }
                    }
                    if (
                        [
                            'BG_LEVEL_JS',
                            'BG_LEVEL_XS'
                        ].includes(type)
                    ) {
                        this.jsxsDialog = true;
                        if (
                            ['BG_LEVEL_JS'].includes(
                                type
                            )
                        ) {
                            this.jssxReprot = true;
                        } else {
                            this.jssxReprot = false;
                        }
                    }
                });
            }

            // if (
            //     currentPageName === '专业诊改报告' ||
            //     currentPageName === '课程诊改报告'
            // ) {
            // this.$refs.createDialogRef.getProfessional();
            // } else {
            // if (
            //     currentPageName === '学校总体诊改报告' ||
            //     currentPageName === '层面诊改报告' ||
            //     currentPageName === '教学单位诊改报告'
            // ) {
            //     this.$refs.createDialogRef.changeDept(
            //         getStorage('userInfo').orgCode
            //     );
            // }
            // }
        },
        changeYear (val) {
            const params = {
                reportIndex: this.$route.params.type,
                year: val
            };
            getProfessionalByIds(params).then(res => {
                console.log(res, 'getProfessionalByIds');
                this.reportNameOptions = res;
            });
        },
        changeReportName (val) {
            getDiagnosiaReform({
                reportIndex: this.$route.params.type,
                year: this.formData.year,
                id: val
            }).then(res => {
                console.log(res, 'getDiagnosiaReform');
                this.departList = res.a;
                this.formData.deptCode = res.a[0].id;
                this.editPersonList = res.b;
                this.formData.editPersons = res.b;
                // console.log(typeof this.formData.editPersons);
                this.targetStandardList = res.c;
                this.formData.chain = res.c;
            });
        },
        getReport () {
            getOfflineReport(this.searchFrom).then(res => {
                this.report = res.dataList;
                this.total = res.total;
            });
        },
        close (formName) {
            this.$refs[formName].resetFields();
            this.zykcDialog = false;
            this.jsxsDialog = false;
        },
        save () {
            const params = {
                reportIndex: this.$route.params.type,
                reportName: this.reportNameOptions[0].reportName,
                reportYear: this.formData.year,
                preparationDepartment: getStorage('userInfo').orgId,
                preparationPaticipant: this.editPersonList,
                targetStandardId: this.formData.chain[0].id,
                examineUser: getStorage('userInfo').id
            };
            createReportApi(params).then(res => {
                console.log(res);
                this.message('success', '操作成功');
                this.zykcDialog = false;
                this.getList();
            });
        },
        changeTeachYear (val) {
            const params = {
                reportIndex: this.$route.params.type,
                year: val,
                id: getStorage('userInfo').id
            };
            getReportNameById(params).then(res => {
                console.log(res, 'getReportNameById-=');
                this.ruleForm.reportName = res[0].reportName;
            });
            getProfessionalById().then(res => {
                this.ruleForm.belongSchool = res[0].college;
                this.ruleForm.deptCode = res[0].professional;
                this.deptCodeObj = res[0];
                console.log(this.deptCodeObj, 'obj');
            });
            getQueryTarget(params).then(res => {
                this.ruleForm.chain = res[0].name;
                // 此处接口需要调整
                this.chainObj = res[0];
                console.log(res, 'r');
            });
        },
        // changeTeachReportName () {},
        saveRule () {
            const params = {
                reportIndex: this.$route.params.type,
                reportName: this.ruleForm.reportName,
                reportYear: this.ruleForm.year,
                preparationDepartment: this.deptCodeObj.id,
                preparationPaticipant: [
                    {
                        ...getStorage('userInfo'),
                        userId: getStorage('userInfo').id
                    }
                ],
                targetStandardId: this.chainObj.id,
                examineUser: getStorage('userInfo').id
            };
            createReportApi(params).then(res => {
                console.log(res);
                this.message('success', '操作成功');
                this.jsxsDialog = false;
                this.getList();
            });
        },
        getParam (id) {
            this.targetStandardId = id;
        },
        addAssert (reportType) {
            this.uploadVisible.visible = true;
            this.$nextTick(() => {
                this.$refs.uploadRef.closeDialog('fileForm');
            });
            this.$refs.uploadRef.reportType = reportType;
            this.$refs.uploadRef.targetStandardId = this.targetStandardId;
        },
        getId (param) {},
        addReport () {
            this.getReport();
        }
    },
    watch: {
        $route: {
            handler (val, oldval) {
                this.levelType = val.params.type;
                this.searchFrom.reportIndexs = this.levelType;
                this.getList();
            },
            // 深度观察监听
            deep: true
        }
    }
};
</script>

<style>
.el-select-dropdown {
    background: #fff !important;
    border: none !important;
}
.el-select-dropdown__item {
    /* color: #606266 !important; */
}
.el-popper[x-placement^="bottom"] .popper__arrow::after {
    border-bottom-color: #fff !important;
}
</style>
